<template>
  <j-modal title="强制完成采购单" :width="800" :visible.sync="modalVisible" :maskClosable="false">
    <a-form-model ref="form" :model="formData" :rules="rules">
      <a-form-model-item label="采购单号" :labelCol="labelCol" :wrapperCol="wrapperCol">
        {{ orderNo }}
      </a-form-model-item>
      <a-form-model-item label="完成原因" :labelCol="labelCol" :wrapperCol="wrapperCol" prop="finishCause">
        <a-textarea v-model="formData.finishCause" rows="4" placeholder="请输入强制完成原因" :maxLength="128" />
      </a-form-model-item>
    </a-form-model>
    <template #footer>
      <a-button @click="modalVisible = false"> 取消 </a-button>
      <a-button type="primary" :loading="submitLoading" @click="handleOk"> 确定 </a-button>
    </template>
  </j-modal>
</template>

<script>
import { getAction } from '@/api/manage'

export default {
  data() {
    return {
      modalVisible: false,
      submitLoading: false,
      labelCol: {
        xs: { span: 24 },
        sm: { span: 4 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 },
      },
      orderNo: '',
      formData: {
        finishCause: '',
      },
      rules: {
        finishCause: [{ required: true, message: '请输入强制完成原因!' }],
      },
      url: {
        forceComplete: '/hzkj-purchase/purchase/order/info/forceComplete',
      },
    }
  },
  methods: {
    api_open(id, orderNo) {
      this.orderNo = orderNo
      this.formData = {
        id,
        finishCause: '',
      }
      this.modalVisible = true
      this.submitLoading = false
    },
    // 产品提交
    handleOk() {
      this.$refs.form.validate((valid) => {
        if (valid) {
          this.submitLoading = true
          getAction(this.url.forceComplete, this.formData)
            .then((res) => {
              if (res.success) {
                this.$message.success('操作成功')
                this.$emit('submit')
                this.modalVisible = false
              } else {
                this.$message.error(res.message)
              }
            })
            .finally(() => {
              this.submitLoading = false
            })
        }
      })
    },
  },
}
</script>
